import React, { Component } from 'react';
import {
    ProgressBarAndroid,
    AppRegistry,
    StyleSheet, Text, Dimensions, TouchableOpacity, Image,
    View, ScrollView,
    ActivityIndicator,
    FlatList


} from 'react-native';

import {
    Tabs, Icon, Button,
    Modal,
    WhiteSpace,
    WingBlank,
    Toast, Flex, Tag, DatePicker, List,
    Provider,
} from '@ant-design/react-native';
import request from '../../static/utils/request';

import RefreshListView, { RefreshState } from "react-native-refresh-list-view";

const Item = List.Item;
const Brief = Item.Brief;

export default class Home extends Component {


    state = {
        refreshState: RefreshState.Idle, //默认状态
        isLoading: true,
        pageIndex: 1, //页码
        pageSize: 10, //每页的页容量
        total: 0, //总条数
        movieList: [], //加载出来的电影数组
        visible3: false,
        visible2: false,
        value: undefined,
        rowCount: 0
    };


    onClose3 = () => {
        this.setState({
            visible3: false,
        });
    };

    onClose2 = () => {
        this.setState({
            visible2: false,
        });
    };


    onDatePicker = (value) => {
        console.log(value)
        this.setState({ value });
    };

    componentDidMount() {
        this.onsave()
    }

    onsave = () => {
        const start = (this.state.pageIndex - 1) * this.state.pageSize;

        request({
            url: `/zhrq-web/patrol/patroltask/getPageList`,
            method: 'POST',
            data: {}
        }).then(data => {
            console.log(data, 456)
            if (data.rc == 0) {
                this.setState({
                    movieList: data.ret.items,
                    rowCount: data.ret.rowCount
                })

            }
        })
    }

    onimg = () => {
        console.log(31)
    }

    onqd = () => {
        console.log(789)
        this.setState({
            visible2: false
        })
        this.props.navigation.navigate('Home_qd')
    }

    onjcb = () => {
        console.log(789)
        this.setState({
            visible2: false
        })
        this.props.navigation.navigate('Home_jcb')
    }

    ondetails = () => {
        this.props.navigation.navigate('Home_Details')
    }




    _keyExtractor = (item, index) => item.id;

    render() {




        return (
            <View
                style={{ flex: 1, justifyContent: 'center', backgroundColor: "#F2F2F2" }}>
                <View
                    style={{ flexDirection: "row", alignItems: "center", height: 50, backgroundColor: "#fff", borderBottomEndRadius: 3, borderBottomLeftRadius: 3, elevation: 2, marginBottom: 10, display: "flex", justifyContent: "space-around" }}>
                    <Tag>距离最近</Tag>
                    <Tag>好评优先</Tag>
                    <Tag>销量最高</Tag>
                    <Tag>经常使用</Tag>
                </View>

                <View style={{ flex: 1, backgroundColor: "#fff" }}>
                    <ScrollView style={{ flex: 1,paddingLeft:15,paddingRight:15 }}>
                      
                        {

                            this.state.movieList.map((item, index) => {
                                return (
                                    <TouchableOpacity style={{alignItems: 'center', flexDirection: "row", height: 100, backgroundColor: "#fff", borderRadius: 5, elevation: 3, marginBottom: 10, display: "flex" }} key={index}
                                        onPress={this.ondetails}
                                    >
                                        <Image
                                            style={{ width: 60, height: 60 }}
                                            source={require('../../static/img/rqz.jpg')}
                                        />
                                        <View style={{ flex: 1 ,padding:10}}>
                                            <View style={{ flex: 1, flexDirection: "row", alignItems: "center", paddingLeft: 15 }}>
                                                <View style={{ flex: 4 }}>
                                                    <Text style={{ fontSize: 16, color: "#000" }}>{item.taskName}</Text>
                                                </View>

                                            </View>

                                            <View style={{ flex: 1, alignItems: "center", flexDirection: "row", paddingLeft: 15 }}>
                                                <View style={{ flex: 1, flexDirection: "row", display: "flex"  }}>
                                                    <Icon name='star' size="xs"/><Text>4.9</Text>
                                                </View>
                                                <View style={{ flex: 3 }}>
                                                    <Text >月售</Text>
                                                </View>
                                            </View>

                                            <View style={{ flex: 1, alignItems: "center", flexDirection: "row", paddingLeft: 15 }}>
                                                <View style={{ flex: 4, flexDirection: "row", display: "flex"  }}>
                                                    <Text>武汉市武昌区XX路</Text>
                                                </View>
                                                <View style={{ flex: 1 }}>
                                                    <Text >3.5km</Text>
                                                </View>
                                            </View>
                                        </View>

                                    </TouchableOpacity>
                                )
                            })
                        }



                    </ScrollView>
                </View>

            </View>



        )

    }
}